<template>
  <div id="app">
    <!-- element-ui 容器布局 -->
    <el-container>
      <!-- 头部 -->
      <!--<el-header>-->
        <!--&lt;!&ndash; 头部组件渲染 &ndash;&gt;-->
        <!--&lt;!&ndash;<v-header :HeaderFlag="HeaderFlag" :menuList="menuList"></v-header>&ndash;&gt;-->
        <!--<v-header></v-header>-->
      <!--</el-header>-->

      <!-- 中间主要区域容器 -->
      <el-container>
        <!-- 添加一个element-ui内置的过渡动画 -->
        <!--<transition name="el-zoom-in-center">-->
          <!-- 通过路由渲染不同内容的页面 -->
          <!--<router-view  @setHeader="setHeader" @setMenu="setMenu" />-->
          <router-view />
        <!--</transition>-->
      </el-container>

      <!-- 底部 -->
      <!--<el-footer>-->
        <!--&lt;!&ndash; 底部组件渲染 &ndash;&gt;-->
        <!--<v-footer></v-footer>-->
      <!--</el-footer>-->

    </el-container>
  </div>
</template>

<script>
  //导入组件
//  import Header from '@/components/Header/Header'
 import Footer from '@/components/Footer/Footer'

export default {
  name: 'app',
 // components: {
 //   // 'v-header': Header,
 //   'v-footer': Footer
 // },
  data(){
    return{
//      HeaderFlag:false,
//      menuList: ''
    }
  },
  methods:{
//    setHeader(flag) {
//      this.HeaderFlag = flag;
//    },
//    setMenu(menuList) {
//      this.menuList = menuList;
//    }
  }
}
</script>

<style scoped>
  .el-container > div {
    width: 100%;
  }
  .el-footer{
    height:20px;
  }

</style>
